﻿<DemoPageSectionComponent Id="DataGrid-ColumnChooser-Overview" ShowHorizontalScrollBar="true">
    @inject NwindDataService NwindDataService

    @if(DataSource == null) {
        <p><em>Loading...</em></p>
    } else {
        <DxDataGrid Data="@DataSource">
            <HeaderTemplate>
                <DxToolbar>
                    <DxDataGridColumnChooserToolbarItem Alignment="ToolbarItemAlignment.Right" />
                </DxToolbar>
            </HeaderTemplate>
            <Columns>
                <DxDataGridColumn Field="@nameof(Employee.FirstName)" />
                <DxDataGridColumn Field="@nameof(Employee.LastName)" />
                <DxDataGridColumn Field="@nameof(Employee.Title)" />
                <DxDataGridDateEditColumn Field="@nameof(Employee.HireDate)" />
                <DxDataGridDateEditColumn Field="@nameof(Employee.BirthDate)" Visible="false" />
                <DxDataGridColumn Field="@nameof(Employee.ImageFileName)" Visible="false" />
                <DxDataGridColumn Field="@nameof(Employee.Notes)" Visible="false" />
            </Columns>
        </DxDataGrid>
    }
    @code {
        IEnumerable<Employee> DataSource;

        protected override async Task OnInitializedAsync() {
            DataSource = await NwindDataService.GetEmployeesAsync();
        }
    }
</DemoPageSectionComponent>
